<template>
  <section>
    <section class="view-box">
      <section class="task-info">
        <div class="row-block">
          <table border rules="all" class="table-style">
            <tr class="title-tr">
              <td colspan="2">当日收入</td>
              <td colspan="2">当日余额</td>
              <td colspan="2">兑奖记录</td>
            </tr>
            <tr>
              <td>现金</td>
              <td>{{ form.dayIncomeMoney }}</td>
              <td>现金</td>
              <td>{{ form.dayBalanceMoney }}</td>
              <td>体彩彩票兑奖</td>
              <td>{{ form.sportVoteCashPrize }}</td>
            </tr>
            <tr>
              <td>微信</td>
              <td>{{ form.dayIncomeWechat }}</td>
              <td>微信</td>
              <td>{{ form.dayBalanceWechat }}</td>
              <td>体彩刮卡兑奖</td>
              <td>{{ form.sportScratchCardCashAPrize }}</td>
            </tr>
            <tr>
              <td>支付宝</td>
              <td>{{ form.dayIncomeAlipay }}</td>
              <td>支付宝</td>
              <td>{{ form.dayBalanceAlipay }}</td>
              <td>福彩兑奖</td>
              <td>{{ form.luckyLotteryRedemption }}</td>
            </tr>
            <tr>
              <td>收款码</td>
              <td>{{ form.dayIncomePaymentCode }}</td>
              <td rowSpan="5">合计</td>
              <td rowSpan="5">{{ form.dayBalanceAllMoney }}</td>
              <td>合计</td>
              <td>{{ form.redemptionAllMoney || 0 }}</td>
            </tr>
            <tr>
              <td>刮刮卡转入</td>
              <td>{{ form.dailyIncomeScrapingCard }}</td>
              <td rowSpan="4" class="keynote">差异</td>
              <td rowSpan="4" class="keynote">{{ form.difference }}</td>
            </tr>
            <tr>
              <td>刮刮卡转出（当日）</td>
              <td>{{ form.dailyOutScrapingCard || 0 }}</td>
            </tr>
            <tr>
              <td>刮刮卡转出（次日）</td>
              <td>{{ form.nextDailyOutScrapingCard || 0 }}</td>
            </tr>
            <tr>
              <td>合计</td>
              <td>{{ form.dayIncomeAllMoney }}</td>
            </tr>
            <tr class="title-tr">
              <td colspan="2">应交款（当日销售）</td>
              <td colspan="2">昨日余额</td>
              <td colspan="2">票机当日余额</td>
            </tr>
            <tr>
              <td>体彩应交款</td>
              <td>{{ form.sportPayables }}</td>
              <td>体彩机</td>
              <td>{{ yesterday.sportAtThatTime }}</td>
              <td>体彩机</td>
              <td>{{ form.sportAtThatTime }}</td>
            </tr>
            <tr>
              <td>福彩应交款</td>
              <td>{{ form.luckyPayables }}</td>
              <td>福彩机</td>
              <td>{{ yesterday.luckyAtThatTime }}</td>
              <td>福彩机</td>
              <td>{{ form.luckyAtThatTime }}</td>
            </tr>
            <tr>
              <td>刮刮卡应交款</td>
              <td>{{ form.scratchCardPayables }}</td>
              <td>刮刮卡</td>
              <td>{{ yesterdayScratchCardAtThatTime }}</td>
              <!-- <td>{{ yesterday.scratchCardAtThatTime }}</td> -->
              <td>刮刮卡</td>
              <!-- <td>{{ scratchCardAtThatTime }}</td> -->
              <td>{{ form.scratchCardAtThatTime }}</td>
            </tr>
            <tr>
              <td>应交款合计</td>
              <td>{{ form.totalPayables }}</td>
              <td>合计</td>
              <td>{{ yesterday.totalAtThatTime }}</td>
              <td>合计</td>
              <td>{{ form.totalAtThatTime }}</td>
            </tr>
            <tr>
              <td colspan="2" class="title-tr">体彩充值金额</td>
              <td colspan="1">{{ form.sportRechargeAmount }}</td>
              <td colspan="2" class="title-tr">微信充值</td>
              <td colspan="1">{{ form.weChatRecharge }}</td>
            </tr>
            <tr>
              <td colspan="2" class="title-tr">福彩充值金额</td>
              <td colspan="1">{{ form.luckyRechargeAmount }}</td>
              <td colspan="2" class="title-tr">支付宝充值</td>
              <td colspan="1">{{ form.alipayRecharge }}</td>
            </tr>
            <tr>
              <td colspan="2" class="title-tr">体彩订卡金额</td>
              <td colspan="1">{{ form.sportCardSubscriptionAmount }}</td>
              <td colspan="2" class="title-tr">百元现金取走数量</td>
              <td colspan="1">{{ form.cashWithdrawalAmountOf100 }}</td>
            </tr>
            <tr>
              <td colspan="2" class="title-tr">福彩订卡金额</td>
              <td colspan="1">{{ form.luckyCardSubscriptionAmount }}</td>
              <td colspan="2" class="title-tr">当班人员</td>
              <td colspan="1">{{ form.substitutePersonnel }}</td>
            </tr>
            <tr>
              <td colspan="2" class="title-tr">体彩佣金</td>
              <td colspan="1">{{ form.sportsLotteryCommission }}</td>
              <td rowSpan="3" colspan="2" class="title-tr">取走人</td>
              <td rowSpan="3" colspan="1">{{ form.takeAwayPeople }}</td>
            </tr>
            <tr>
              <td colspan="2" class="title-tr">福彩佣金</td>
              <td colspan="1">{{ form.luckyLotteryCommission }}</td>
            </tr>
            <tr>
              <td colspan="2" class="title-tr">刮刮卡佣金</td>
              <td colspan="1">{{ form.scrapingCardCommission || 0 }}</td>
            </tr>
            <tr class="title-tr">
              <td colspan="6">备注</td>
            </tr>
            <tr>
              <td colspan="6">{{ form.notes }}</td>
            </tr>
          </table>
        </div>
      </section>
    </section>
  </section>
</template>

<script>
import Tools from '@/libs/utils.tool'
import { lastDayData } from '@/api/modules/sys.report.api'

export default {
  name: 'view-report-info',
  components: {},
  data() {
    return {
      form: {},
      yesterday: {
        totalAtThatTime: 0,
        scratchCardAtThatTime: 0,
        luckyAtThatTime: 0,
        sportAtThatTime: 0
      }
    }
  },
  props: {
    viewData: {
      type: Object,
      default() {
        return null
      }
    }
  },
  created() {
    this.getYesterdayData()
    this.loadData(this.viewData)
  },

  computed: {
    yesterdayScratchCardAtThatTime() {
      //  - this.retNum(this.yesterday.dailyOutScrapingCard)
      // + this.retNum(this.yesterday.dailyIncomeScrapingCard)
      // + this.retNum(this.yesterday.dailyIncomeScrapingCard)
      return (this.retNum(this.yesterday.scratchCardAtThatTime) - this.retNum(this.yesterday.nextDailyOutScrapingCard)).toFixed(2)
    },
    // scratchCardAtThatTime() {
    //   // + this.retNum(this.form.dailyIncomeScrapingCard)
    //   return (this.retNum(this.form.scratchCardAtThatTime)  - this.retNum(this.form.dailyOutScrapingCard)).toFixed(2)
    // }
  },
  methods: {
    retNum(val) {
      return Number(val) || 0
    },
    loadData(data) {
      this.form = data || {}
    },
    // 获取昨日数据
    getYesterdayData() {
      lastDayData({
        dayDate: "'" + this.viewData.dayDate + "'",
        shop: "'" + this.viewData.shop + "'"
      }).then(res => {
        if (res[0]) {
          this.yesterday = res[0]
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.table-style {
  width: 100%;

  td {
    text-align: center;
    padding: 6px 8px;
  }

  .title-tr {
    font-weight: bold;
    background-color: #f5f7fa;
  }

  .keynote {
    font-weight: bold;
    background-color: #c9c9c9;
    font-size: 20px;
  }
}
</style>
